{% extends "layout.html" %}
{% block body %}
<link rel="stylesheet" href="{{ url_for('static', filename='house/css/index.css') }}">

<div class="container mt-4">
    <div class="row">
        <div class="col-12 tj-header">
            <h3>热点房源</h3>
            <div class="describe">
                <span>为您精选的热门房源</span>
                <span class="float-right">
                    <a href="{{ url_for('list.city_house', city='北京', page=1) }}" style="color:#3498db;">更多北京房源</a>
                </span>
            </div>
        </div>
    </div>

    <div class="row mt-3">
        {% if houses %}
            {% for house in houses %}
            <div class="col-lg-4 col-md-6 mb-4">
                <div class="card h-100">
                    <a href="/house/{{ house.id }}">
                        {% if house.image %}
                            {% if house.image.startswith('http') %}
                                <img class="card-img-top img-box" src="{{ house.image }}" alt="{{ house.address }}">
                            {% else %}
                                <img class="card-img-top img-box"
                                     src="{{ url_for('static', filename='uploads/' ~ house.image) }}"
                                     alt="{{ house.address }}">
                            {% endif %}
                        {% else %}
                            <img class="card-img-top img-box" src="{{ url_for('static', filename='uploads/default_house.jpg') }}" alt="默认房源">
                        {% endif %}
                    </a>
                    <div class="card-body">
                        <h5 class="card-title">{{ house.address }}</h5>
                        <p class="card-text">{{ house.rooms }} 室 · {{ house.area }} 平米</p>
                        <p class="card-text text-danger">￥{{ house.price }}</p>
                    </div>
                </div>
            </div>
            {% endfor %}
        {% else %}
            <div class="col-12">
                <p>当前没有房源。</p>
            </div>
        {% endif %}
    </div>

    <!-- 分页 -->
    {% if pagination %}
    <nav aria-label="Page navigation">
      <ul class="pagination justify-content-center">
        <li class="page-item{% if not pagination.has_prev %} disabled{% endif %}">
          <a class="page-link" href="{{ url_for('list.hot_house', page=1) }}" tabindex="-1">首页</a>
        </li>
        <li class="page-item{% if not pagination.has_prev %} disabled{% endif %}">
          <a class="page-link" href="{{ url_for('list.hot_house', page=(pagination.page-1 if pagination.page>1 else 1)) }}">上一页</a>
        </li>

        {% for p in page_range %}
        <li class="page-item{% if p == pagination.page %} active{% endif %}">
          <a class="page-link" href="{{ url_for('list.hot_house', page=p) }}">{{ p }}</a>
        </li>
        {% endfor %}

        <li class="page-item{% if not pagination.has_next %} disabled{% endif %}">
          <a class="page-link" href="{{ url_for('list.hot_house', page=(pagination.page+1 if pagination.page < pagination.pages else pagination.pages)) }}">下一页</a>
        </li>
        <li class="page-item{% if pagination.page == pagination.pages %} disabled{% endif %}">
          <a class="page-link" href="{{ url_for('list.hot_house', page=pagination.pages) }}">末页</a>
        </li>
      </ul>
    </nav>
    {% endif %}
</div>

{% endblock %}
